<template>
  <component :is="props.tag" :style="styleProps"  class="l-text-component">
    {{ props.text }}
  </component>
</template>

<script lang="ts">
 import { transformToComponentProps,textDefaultProps } from '../defaultTemplate';
 import useComponentCommon from '@/hooks/useComponentCommon'
 const textTransform = {
  tag: {
    type: String,
    default: 'div'
  },
  ...transformToComponentProps(textDefaultProps)
}

export default {
  name: 'LText'
}
</script>

<script setup lang="ts">
import { 
  defineProps, 
  computed
 } from 'vue';

import { pick } from "lodash-es";

const props =defineProps(textTransform)

const componentCommon = useComponentCommon(props,  ['fontSize'])


const styleProps = componentCommon.styleProps

</script>



<style scoped lang="scss">

</style>